<template>
	<view id="app">
		<view class="container fdc ais bgw">
			<view class="f30 c666 mb15">当前城市</view>
			<view class="df">
				<view class="f1 df f32 fw4 pb5 bdb1s brcce c000">{{location.city}}</view>
				<view class="w200 df jcr f30 pb5 bdb1s brcf " @click="islocation">重新定位</view>
			</view>
		</view>
		<uv-index-list :index-list="indexList" customNavHeight="100rpx">
			<block v-for="(item, index) in itemArr" :key="index">
				<uv-index-item>
					<uv-index-anchor :text="indexList[index]"></uv-index-anchor>
					<view class="list-cell" v-for="(cell, i) in item" :key="i" @click="choose(cell)">
						{{cell.short_name}}
					</view>
				</uv-index-item>
			</block>
		</uv-index-list>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				location:{
					city:"",
					city_id:'',
					lat:"",//经度
					lng:""//纬度
				},
				indexList: ["A", "B", "C", "D", "E", "F", "G"],
				itemArr: []
			}
		},
		onLoad(){
			this.getlist();
			if(uni.getStorageSync('QLXG_LOCATION')){
				this.location = JSON.parse(uni.getStorageSync('QLXG_LOCATION'));
			}else{
				this.showlocation();
			}
		},
		onShow(){
			
		},
		methods:{
			getlist:function(){
				let that = this;
				this.request({
					url: '/api/index/city'
				}).then((res)=>{
					if(res.code == 200){
					that.indexList = res.data.index;
					that.itemArr = res.data.value;
					}
				})
			},
			choose:function(e){
				console.log(e.id,e.short_name);
				this.location.city_id = e.id;
				this.location.city = e.short_name;
				uni.setStorageSync('QLXG_LOCATION',JSON.stringify(this.location));
				uni.navigateBack();
			},
			islocation:function(){
				this.showlocation();
				uni.navigateBack();
			},
			showlocation:function(){
				let that = this;
				this.util.getLocation(function(res){
					console.log(res);
					//this.location.lat = res.latitude,
					//this.location.lng = res.longitude,
					//res.latitude,res.longitude
					let openid = uni.getStorageSync('QLXG_openid');
					that.request({
						url:'/api/index/location',
						data:{lat:res.latitude,lng:res.longitude,openid:openid},
						success:function(rs){
							if(rs.code =='200'){
								that.location = rs.data;
								uni.setStorageSync('QLXG_LOCATION',JSON.stringify(that.location));
							}
						}
					})
				})
			}
		}
	}
</script>
<style lang="scss" scoped>

	.list-cell {
		display: flex;
		box-sizing: border-box;
		width: 100%;
		padding: 10px 24rpx;
		overflow: hidden;
		color: #323233;
		font-size: 28rpx;
		background-color: #fff;
	}
</style>